<template>
	<el-dialog :title="title" v-model="visible"  :width="950"  destroy-on-close @closed="$emit('closed')">
		<el-form ref="dialogForm" label-width="100px">
			<el-form-item label="字段" prop="remark">
				<el-checkbox
					v-model="checkAll" :indeterminate="isIndeterminate"
					@change="handleCheckAllChange">全选
				</el-checkbox>
				<el-checkbox-group v-model="default_export_fields" @change="handleCheckedChange">
					<el-checkbox
						v-for="(item,key) in allow_export_fields"
						:key="key" :label="key">{{ item }}
					</el-checkbox>
				</el-checkbox-group>
			</el-form-item>
			<el-form-item label="备注" prop="remark">
				<el-input v-model="remark" clearable type="textarea"></el-input>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="visible = false">关 闭</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">导 出</el-button>
		</template>
	</el-dialog>
</template>

<script>
export default {
	emits: ['success', 'closed'],
	props: {
		search: {},
		exportService: {type: String, default: ''},
		total: {type: String, default: ''},
	},
	data() {
		return {
			title: "导出文件",
			visible: false,
			isSaveing: false,
			checkAll: false,
			isIndeterminate: false,
			apiObj: this.$API.common.export,
			selection: null,
			allow_export_fields: [],
			default_export_fields: [],
			remark: '',
		}
	},
	mounted() {
		this.show();
	},
	methods: {
		//显示
		open() {
			this.visible = true;
			return this
		},
		//关闭
		close() {
			this.visible = false;
			return this
		},
		async show() {
			this.isSaveing = true
			let res = await this.apiObj.show.get({exportService: this.exportService})
				.finally(() => {
					this.isSaveing = false
				});
			this.allow_export_fields = res.data['allow_export_fields'];
			this.default_export_fields = res.data['default_export_fields'];
		},
		//表单提交方法
		async submit() {
			if(this.remark == ''){
				this.$alert('请填写备注信息', "提示", {type: 'error'})
				return;
			}
			if(this.default_export_fields.length <= 0){
				this.$alert('请选择导出字段', "提示", {type: 'error'})
				return;
			}
			this.apiObj.export.post({
				search: this.search,
				remark: this.remark,
				total: this.total,
				exportService: this.exportService,
				export_fields: this.default_export_fields
			}).then(res => {
				if (res.code === 0) {
					this.visible = false;
					this.$message.success("操作成功")
					if (res.data.is_download) {
						window.open(res.data.jump_url);
					} else {
						this.$router.push('/exportFile');
					}
				} else {
					this.$alert(res.msg, "提示", {type: 'error'})
				}
			}).catch(res => {
				this.$alert(res.msg, "提示", {type: 'error'})
			}).finally(() => {
				this.isSaveing = false
			});
		},
		handleCheckAllChange(val) {
			if (val === true) {
				this.default_export_fields = Object.keys(this.allow_export_fields);
			} else {
				this.default_export_fields = [];
			}
		},
		handleCheckedChange(value) {
			const checkedCount = value.length
			this.checkAll = checkedCount === Object.keys(this.allow_export_fields).length
			this.isIndeterminate = checkedCount > 0 && checkedCount < Object.keys(this.allow_export_fields).length
		},
		//搜索
		upsearch() {
			this.$refs.table.upData(this.search)
		},
	}
}
</script>

<style></style>
